<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<title></title>
	</head>
	<style type="text/css">
	</style>
	<body>
		<div class="container">
			<input type="text" v-model="one" />
			<select v-model="opt">
				<option value="+">+</option>
				<option value="-">-</option>
				<option value="*">*</option>
				<option value="/">/</option>
			</select>
			<input type="text" v-model="two" />
			<input type="button" value="=" @click="calc"/>
			<input type="text" v-model="result" />
		</div>
		<script src="lib/vue.js"></script>
		<script type="text/javascript">
			var vm = new Vue({
				el: ".container",
				data:{
					one:0,
					two:0,
					result:0,
					opt:'+',
				},
				methods: {
					calc(){
						/*switch(this.opt){
							case '+':
							  this.result = parseInt(this.one) + parseInt(this.two);
							 break;
							 case '-':
							  this.result = parseInt(this.one) - parseInt(this.two);
							 break;
							 case '*':
							  this.result = parseInt(this.one) * parseInt(this.two);
							 break;
							 case '/':
							  this.result = parseInt(this.one) / parseInt(this.two);
							 break;
						}*/
						let codeStr= 'parseInt(this.one)' +this.opt +'parseInt(this.two)';
						this.result = eval(codeStr)
					}
				}
			})
		</script>
	</body>

</html>